<div data-controller="tabs">
  <ul class="nav nav-pills mb-3" role="tablist">
    <% if spree.respond_to?(:admin_user_visits_path) %>
      <li class="nav-item" role="presentation">
        <a class="nav-link active" id="pills-overview-tab" data-tabs-target="tab" data-action="click->tabs#select" role="tab" aria-controls="pills-overview" aria-selected="true">Timeline</a>
      </li>
    <% end %>

    <% if can?(:read, Spree::Order) %>
      <li class="nav-item" role="presentation">
        <a class="nav-link <%= 'active' unless spree.respond_to?(:admin_user_visits_path) %>" id="pills-orders2-tab" data-tabs-target="tab" data-action="click->tabs#select" role="tab" aria-controls="pills-orders2" aria-selected="false"><%= Spree.t(:orders) %></a>
      </li>
      <li class="nav-item" role="presentation">
        <a class="nav-link" id="pills-checkouts-tab" data-tabs-target="tab" data-action="click->tabs#select" role="tab" aria-controls="pills-checkouts" aria-selected="false"><%= Spree.t(:draft_orders) %></a>
      </li>
    <% end %>

    <% if spree.respond_to?(:admin_user_gift_cards_path) && can?(:read, Spree::GiftCard) %>
      <li class="nav-item" role="presentation">
        <a class="nav-link" id="pills-gift-cards-tab" data-tabs-target="tab" data-action="click->tabs#select" role="tab" aria-controls="pills-gift-cards" aria-selected="false"><%= Spree.t(:gift_cards) %></a>
      </li>
    <% end %>

    <% if can?(:read, Spree::StoreCredit) %>
      <li class="nav-item" role="presentation">
        <a class="nav-link" id="pills-store-credits-tab" data-tabs-target="tab" data-action="click->tabs#select" role="tab" aria-controls="pills-store-credits" aria-selected="false"><%= Spree.t(:store_credits) %></a>
      </li>
    <% end %>
  </ul>

  <% if spree.respond_to?(:admin_user_visits_path) %>
    <div data-tabs-target="panel" id="pills-overview" role="tabpanel" aria-labelledby="pills-overview" class="pt-3 animate__animated animate__fadeIn">
      <%= turbo_frame_tag :user_visits, src: spree.admin_user_visits_path(@user), target: '_top' %>
    </div>
  <% end %>

  <% if can?(:read, Spree::Order) %>
    <div data-tabs-target="panel" id="pills-orders2" role="tabpanel" aria-labelledby="pills-orders2" class="animate__animated animate__fadeIn" <%= 'hidden' if spree.respond_to?(:admin_user_visits_path) %>>
      <div class="card-lg">
        <%= turbo_frame_tag :orders_list, src: spree.admin_user_orders_path(@user, frame_name: :orders_list), loading: :lazy, autoscroll: true, data: { autoscroll_block: :nearest, autoscroll_behavior: :smooth } do %>
          <%= render 'spree/admin/shared/spinner' %>
        <% end %>
      </div>
    </div>

    <div data-tabs-target="panel" id="pills-checkouts" role="tabpanel" aria-labelledby="pills-checkouts" hidden class="animate__animated animate__fadeIn">
      <div class="card-lg">
        <%= turbo_frame_tag :orders_list, src: spree.admin_user_checkouts_path(@user, frame_name: :orders_list), loading: :lazy, autoscroll: true, data: { autoscroll_block: :nearest, autoscroll_behavior: :smooth } do %>
          <%= render 'spree/admin/shared/spinner' %>
        <% end %>
      </div>
    </div>
  <% end %>

  <% if spree.respond_to?(:admin_user_gift_cards_path) && can?(:read, Spree::GiftCard) %>
    <div data-tabs-target="panel" id="pills-gift-cards" role="tabpanel" aria-labelledby="pills-gift-cards" hidden class="animate__animated animate__fadeIn">
      <div class="card-lg">
        <%= turbo_frame_tag :gift_cards_list, src: spree.admin_user_gift_cards_path(@user, frame_name: :gift_cards_list), loading: :lazy, autoscroll: true, data: { autoscroll_block: :nearest, autoscroll_behavior: :smooth } do %>
          <%= render 'spree/admin/shared/spinner' %>
        <% end %>
      </div>
    </div>
  <% end %>

  <% if can?(:read, Spree::StoreCredit) %>
    <div data-tabs-target="panel" id="pills-store-credits" role="tabpanel" aria-labelledby="pills-store-credits" hidden class="animate__animated animate__fadeIn">
      <div class="card-lg">
        <%= turbo_frame_tag :store_credits_list, src: spree.admin_user_store_credits_path(@user, frame_name: :store_credits_list), loading: :lazy, autoscroll: true, data: { autoscroll_block: :nearest, autoscroll_behavior: :smooth } do %>
          <%= render 'spree/admin/shared/spinner' %>
        <% end %>
      </div>
    </div>
  <% end %>
</div>
